<template>
  <view>
    <view class="popup-header" v-if="showTitle === true">
      <u--text type="info" :text="getTranslate(0)" align="center"></u--text>
    </view>
    <view class="popup-search">
      <u--text type="info" :text="getTranslate(3)" align="left" size="10"></u--text>
      <u-search shape="square" :showAction="false" :placeholder="getTranslate(2)" v-model="searchContent"></u-search>
    </view>
    <view :style="{width: popUpInfo.width + 'px', height: popUpInfo.height + 'px'}" v-if="popUpInfo.needScroll">
      <seg-content-group>
        <scroll-view scroll-x scroll-y :style="{height: popUpInfo.maxHeight + 'px'}">
          <seg-table :headInfo="tableData.head" :line-info="getLine()" :errorMonitor="tableData.errorMonitor" @reUpload="reUpload"></seg-table>
        </scroll-view>
      </seg-content-group>
    </view>
    <view v-else :style="{height: popUpInfo.height + 'px'}">
      <seg-content-group>
        <scroll-view scroll-y :style="{height: popUpInfo.maxHeight + 'px'}">
          <seg-table :headInfo="tableData.head" :line-info="getLine()" :errorMonitor="tableData.errorMonitor" @reUpload="reUpload"></seg-table>
        </scroll-view>
      </seg-content-group>
    </view>
  </view>
</template>

<script>
import language from "../../api/language";

export default {
  name: "segUploadDetail",
  props: {
    popUpInfo: {
      default: {},
      type: Object
    },
    tableData: {
      default: {},
      type: Object
    },
    showTitle: {
      default: true,
      type: Boolean
    }
  },
  data(){
    return {
      searchContent: ''
    }
  },
  methods: {
    getTranslate(posIndex){
      let langDict = language.getTranslate(language.segUploadDetail)
      if (posIndex === 0){
        return langDict.title
      }else if(posIndex === 1){
        return langDict.searchButton
      }else if(posIndex === 2){
        return langDict.searchPlaceholder
      }else if(posIndex === 3){
        return langDict.clickToClose
      }
    },
    reUpload(errorMonitor){
      this.$emit('reUpload', errorMonitor)
    },
    getLine(){
      if(this.searchContent === ''){
        return this.tableData.line
      }else{
        let line = []
        for(let i = 0; i < this.tableData.line.length; i++){
          let eachArray = this.tableData.line[i]
          if(eachArray[0].name.search(this.searchContent) !== -1){
            line.push(eachArray)
          }
        }
        return line
      }
    }
  }
}
</script>

<style scoped>
  .popup-header {
    margin-top: 25px;
    margin-bottom: 10px;
  }
  .popup-search {
    margin: 2% 5%;
  }
</style>
